<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>流程设计器</title>
<meta name="author" content="duanqixin@163.com" />
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/jquery-1.8.2.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/raphael-2.1.0.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/designer-1.1.0.js"></script>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/resources/css/designer.css" />
<script type="text/javascript">
$(document).ready(function() {
	WorkFlow(false, false);
	//加载页面事件
	//添加页面监听事件
	$(".wf_package").click(function() {
		$("#package_name").val($(this).html());
	});
	
	//新建流程文件夹
	$("#new_package").click(function() {
		$("#package_name").removeAttr("disabled").css("border-color","blue");
	});
	
	//导入流程文件
	$("#wf_im_file").click(function() {
		$("#up_file_btn").val("").click();
	});
	//导入文件后事件
	$("#up_file_btn").change(function() {
		if($(this).val() != "") {
			alert($(this).val());
		}
	});
});
</script>
</head>
<body>
	<div class="wf_head">
		<div class="wf_head_name">流程设计器</div>
		<button id="wf_new" class="wf_head_ime">新建流程</button>
		<button id="wf_im_exist" class="wf_head_ime">导入已有流程</button>
		<button id="wf_im_file" class="wf_head_ime">导入流程文件</button>
		<button id="wf_im_publish" class="wf_head_ime">发布</button>
		<button id="wf_im_save" class="wf_head_imes">保存</button>
		<button id="wf_im_betiy" class="wf_head_imes">美化器</button>
		<button id="wf_test" class="wf_head_imes">test</button>
		<input id="sb_data" type="text" style="width: 600px;"/>
	</div>
	<div id="wf_body">
		<div class="wf_tool">
			<div class="wf_tool_head">
				工具栏
			</div>
			<div class="wf_tool_begin">
				开始
			</div>
			<div class="wf_tool_em">
				结束
			</div>
			<div class="wf_tool_em">
				任务
			</div>
			<div class="wf_tool_em">
				线条
			</div>
			<div class="wf_tool_xy">
				X坐标:<input id="x" type="text" class="wf_tool_input"/><br/>
				Y坐标:<input id="y" type="text" class="wf_tool_input"/>
			</div>
			<div class="wf_tool_xy">
				网格：
				<div class="wf_switch_div">
					<div class="wf_switch_zone">
						<div class="wf_switch_open">开</div>
						<div class="wf_switch_cen"></div>
						<div class="wf_switch_close">关</div>
					</div>
				</div>
			</div>
		</div>
		<div id="paper" class="wf_paper wf_paper_bg">
		</div>
		<div class="wf_switch_cloth"></div>
		<div id="cloth" class="wf_cloth">
		</div>
		<div id="data" class="wf_data">
			<div id="data_top" class="wf_data_top"></div>
			<div>
				<table class="wf_data_table">
					<tr>
						<td>名称</td>
						<td><input id="hm_text" type="text" class="wf_data_ip"/></td>
					</tr>
					<tr>
						<td>Step</td>
						<td><input id="hm_step" type="text" class="wf_data_ip"/></td>
					</tr>
					<tr>
						<td>页面</td>
						<td><input id="hm_page" type="text" class="wf_data_ip"/></td>
					</tr>
					<tr>
						<td>角色</td>
						<td>
							<select id="hm_role" class="wf_data_ip">
								<option></option>
								<c:forEach items="${roles}" var="role">
									<option value="${role.roleId}">${role.roleName}</option>
								</c:forEach>
							</select>
						</td>
					</tr>
					<tr>
						<td>执行条件</td>
						<td><input id="hm_exeCid" type="text" class="wf_data_ip"/></td>
					</tr>
				</table>
			</div>
		</div>
	</div>
	<!-- 隔离层 -->
	<div class="isolate_div"></div>
	<div class="load_image"></div>
	<div id="submit_panel" class="wf_submit_panel">
		<div class="wf_sub_head">
			发布流程
		</div>
		<div id="wf_data_sc" class="wf_subdata">
			<div style="border-bottom: #7F9DB9 1px solid;">
				<div style="line-height: 32px;">
					流程文件夹
					<button id="new_package" class="wf_submit">新&nbsp;&nbsp;建</button>
				</div>
				<div id="wf_publish_pkg" class="wf_import_package">
				</div>
			</div>
			<div class="wf_tb_div" style="margin-top:10px;">
				文件夹：<input id="package_name" type="text" class="wf_input" disabled="disabled"/>
			</div>
			<div>
				<div class="wf_tb_div">
					流程名称：<input id="wf_name" type="text" class="wf_input"/>
				</div>
				<div class="wf_tb_div">
				Java文件路径：<input id="java_path" type="text" class="wf_input"/>
				</div>
			</div>
		</div>
		<div>
		</div>
		<div class="wf_subtn">
			<button id="submit_canel" class="wf_canel">取&nbsp;&nbsp;消</button>
			<button id="wf_publist_btn" class="wf_submit">确定发布</button>
		</div>
	</div>
	<div id="import_panel" class="wf_import_panel">
		<div class="wf_sub_head">
			导入流程
		</div>
		<div id="import_sc" class="wf_subdata">
		</div>
		<div class="wf_subtn">
			<button id="import_canel" class="wf_canel">取&nbsp;&nbsp;消</button>
			<button id="import_submit" class="wf_submit">确&nbsp;&nbsp;定</button>
		</div>
	</div>
	<div style="display:none;">
		<input id="up_file_btn" type="file"/>
	</div>
</body>
</html>